<link href="plugins/portfolio/css/portfolio_inside.css" rel="stylesheet" type="text/css" />




			<div id="portfolio_loader">
            	<div class="row">
                   
                    <div id="izq">
                   <a id="image_loader"  style=" background-image:url(plugins/portfolio/images/1/1.jpg);" href="#"></a>
                    </div>
                    
                    <div id="dcha">
                    <h1>Cliente</h1>
                    <p>
                    <strong>Cliente: </strong>Nombre del cliente<br>
                    <strong>Trabajo: </strong>Texto descriptivo del cliente<br>
                    </p>
                    </div>
				</div>
                    
               	
                
            </div>
            <div id="abajo">
                <a href="" class="prev">anterior</a> <a href="" class="next">siguiente</a>
       		</div>
            
            <div id="portfolio_list">
            <?php
			$i = 1;
			 while($i<8){
			
				 echo "<div id='{$i}' class='ficha' onmouseover='over(this.id)' style='background-image:url(plugins/portfolio/images/1/{$i}.jpg);'>
				 <div id='over{$i}' class='ficha_over'>
				 		<div class='texto_ficha' id='titulo{$i}'>
				 			<h1>Texto</h1>
							<p>descripcion</p>
						</div>
					</div>
				 </div>";
            $i++;
            }?>
            </div>
	
		
      
		
		<script language="javascript">
		
		function ajusta(){
			
		var anch_web = $( window ).width()/4;
		 $(".ficha").css("height",anch_web); 
		 $(".ficha").css("width",anch_web); 
		}
		
		$(window).resize(function(e) {
		
ajusta()
		});
$(document).ready(function(){
ajusta()

});
	
	$(".ficha").mouseover(function(){
	
	
	$("#over"+this.id).css("opacity","1");
	$("#titulo"+this.id).css("top","10px");
	});
	
		$(".ficha").mouseout(function(){
	
	$("#over"+this.id).css("opacity","0");
	});




</script>
